// 获取图片资源
//var imageUrl = G_CTX_PATH + "/activiti/resource/process-instance?pid="
//		+ pid + "&type=image";
var imageUrl = G_CTX_PATH + "/cs/workflow/resource/image/" + pid + ".do";
$.getJSON(G_CTX_PATH + '/cs/workflow/processActivityList/' + pid + ".do", function(infos) {
	var positionHtml = "";
	// 生成图片
	var nodeDataArray = new Array();
	$.each(infos, function(i, v) {
		var $positionDiv = $('<div/>', {
			'class': 'activity-attr'
		}).css({
		    position: 'absolute',
		    left: (v.x)*1,
		    top: (v.y)*1,
		    width: (v.width)*1,
		    height: (v.height)*1,
		    backgroundColor: 'black',
		    opacity: 0,
		    zIndex: $.fn.qtip.zindex - 1
		});
		
		// 节点边框
		var $border = $('<div/>', {
			'class': 'activity-attr-border'
		}).css({
		    position: 'absolute',
		    left: (v.x*1 - 5),
		    top: (v.y*1 - 5),
		    width: (v.width*1 + 5),
		    height: (v.height*1 + 5),
		    zIndex: $.fn.qtip.zindex - 2
		});
		
		if (v.currentActivity){
			$border.addClass('ui-corner-all-12').css({
				border: '3px solid red'
			});
		}
		positionHtml += $positionDiv.outerHTML() + $border.outerHTML();
		nodeDataArray[nodeDataArray.length] = v;
	});
	$(".process_image").append(getPicture(imageUrl));
	$(".process_image").append(positionHtml);
	
	// 设置每个节点的data
	$('.activity-attr').each(function(i, v) {
		$(this).data('nodeData', nodeDataArray[i]);
	});
	//tip
	$('.activity-attr').tooltip(
	        {
		        content: function() {
			        var nodeData = $(this).data('nodeData');
			        var tipContent = "<table class='need-border'>";
			        tipContent += "<tr><td style='font-size:8px;'>任务类型:</td><td style='font-size:8px;'>" + nodeData.activityTypeStr + "<td/></tr>";
			        tipContent += "<tr><td style='font-size:8px;'>描述:</td><td style='font-size:8px;'>" + (nodeData.description ? nodeData.description : "" ) + "<td/></tr>";
			        tipContent += "</table>";
			        return tipContent;
		        }
	        });
});
/**
 ** 获取图片
 */
function getPicture(url) {
	var image = $("<img alt=\"流程图\" src='" + url + "' style='position:absolute;'>");//
	return image;
};